<template>
  <el-table
    :data="tableData"
    style="width: 100%"
    stripe 
    height="800"
    :header-cell-style="{ textAlign: 'center' }"
    :cell-style="{ textAlign: 'center' }"
  >
    <el-table-column prop="id" label="ID编号" width="80" />
    <el-table-column prop="name" label="名称"  />
    <el-table-column prop="success" label="成功数量"  />
    <el-table-column prop="total" label="总数"  />
    <el-table-column prop="rate" label="成功率"  />
  </el-table>
</template>
  
  <script setup>
import { onMounted, ref } from "vue";
import { ElMessage } from "element-plus";

const tableData = ref([]);

// 获取数据操作放在onMounted生命周期中
onMounted(() => {
  $api.task
    .getTask()
    .then((result) => {
      console.log("result", result.data);
      if (result.data.code == 0) {
        ElMessage.success(result.data.msg);
        tableData.value = result.data.data;
      } else {
        ElMessage.warning(result.data.msg);
      }
    })
    .catch((err) => {
      console.log("err", err);
    });
});

</script>
  
  <style>
</style>